{% extends 'usercenter-base.html' %}
{% load staticfiles %}

{% block title %}
    <title>个人信息</title>
{% endblock %}

{% block custom_crumbs %}
    <section>
        <div class="wp">
            <ul  class="crumbs">
                <li><a href="{% url 'index' %}">首页</a>></li>
                <li><a href="{% url 'user:user_info' %}">个人中心</a>></li>
                <li>个人信息</li>
            </ul>
        </div>
    </section>
{% endblock %}

{% block right_content %}
    <div class="right">
    <div class="personal_des ">
        <div class="head" style="border:1px solid #eaeaea;">
            <h1>个人信息</h1>
        </div>
        <div class="inforcon">
            <div class="left" style="width:242px;">
                <iframe id='frameFile' name='frameFile' style='display: none;'></iframe>
                <form class="clearfix" id="jsAvatarForm" enctype="multipart/form-data" autocomplete="off" method="post" action="{% url 'user:image_upload' %}" target='frameFile'>
                    <label class="changearea" for="avatarUp">
                        <span id="avatardiv" class="pic">
                            <img width="100" height="100" class="js-img-show" id="avatarShow" src="{{ MEDIA_URL }}{{ user.image }}"/>
                        </span>
                        <span class="fl upload-inp-box" style="margin-left:70px;">
                            <span class="button btn-green btn-w100" id="jsAvatarBtn">修改头像</span>
                            <input type="file" name="image" id="avatarUp" class="js-img-up"/>
                        </span>
                    </label>
                    {% csrf_token %}
                </form>
                <div style="border-top:1px solid #eaeaea;margin-top:30px;">
                    <a class="button btn-green btn-w100" id="jsUserResetPwd" style="margin:80px auto;width:100px;">修改密码</a>
                </div>
            </div>
            <form class="perinform" id="jsEditUserForm" autocomplete="off" method="post" href="{% url 'user:user_info' %}">
                <ul class="right">
                    <li>昵&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;称：
                       <input type="text" name="nick_name" id="nick_name" value="{{ user.nick_name }}" maxlength="10">
                        <i class="error-tips"></i>
                    </li>
                    <li>生&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;日：
                       <input type="text" id="birth_day" name="birthday" value="{{ user.birthday|default_if_none:'' }}" readonly="readonly"/>
                        <i class="error-tips"></i>
                    </li>
                    <li>性&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;别：
                        <label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio"  name="gender" value="male" {% if user.gender == 'male' %}checked="checked"{% endif %}>男</label>
                        <label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="gender" value="female" {% if user.gender == 'female' %}checked="checked"{% endif %}>女</label>
                    </li>
                    <li class="p_infor_city">地&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;址：
                        <input type="text" name="address" id="address" placeholder="请输入你的地址" value="{{ user.address }}" maxlength="10">
                        <i class="error-tips"></i>
                    </li>
                    <li>手&nbsp;&nbsp;机&nbsp;&nbsp;号：
                        <input type="text" name="mobile" id="mobile" placeholder="请输入你的手机号码" value="{{ user.mobile|default_if_none:'' }}" maxlength="11">
                    </li>
                    <li>邮&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;箱：
                        <input class="borderno" type="text" name="email" readonly="readonly" value="{{ user.email }}"/>
                        <span class="green changeemai_btn">[修改]</span>
                    </li>
                    <li class="button heibtn">
                        <input type="button" id="jsEditUserBtn" value="保存">
                    </li>
                </ul>
                {% csrf_token %}
            </form>
        </div>
    </div>
</div>
{% endblock %}



<!--sidebar start-->
<section>
    <ul class="sidebar">
        <li class="qq">
            <a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=2023525077&site=qq&menu=yes"></a>
        </li>
        <li class="totop"></li>
    </ul>
</section>
<!--sidebar end-->
<!--header start-->
